﻿@model T034.ViewModel.CarouselViewModel

<h3>@Model.Header</h3>

<div id="@Model.CarouselId" class="carousel slide" data-ride="carousel" data-interval="@Model.Interval">
    <!-- Indicators -->
    <ol class="carousel-indicators">
        @for (var i = 0; i < Model.Files.Count(); i++ )
        {
            if (i == 0)
            {
                <li data-target="#@Model.CarouselId" data-slide-to="@i" class="active"></li>
            }
            else
            {
                <li data-target="#@Model.CarouselId" data-slide-to="@i"></li>
            }
        }
    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
        @for (var i = 0; i < Model.Files.Count(); i++)
        {
            if (i == 0)
            {
                <div class="item active">
                    <img src="@Url.Content("~" + Model.Files.ToList()[i].Path)" alt="...">
                    <div class="carousel-caption">@Model.Files.ToList()[i].Description</div>
                </div>
            }
            else
            {
                <div class="item">
                    <img src="@Url.Content("~" + Model.Files.ToList()[i].Path)" alt="...">
                    <div class="carousel-caption">@Model.Files.ToList()[i].Description</div>
                </div>
            }
        }
    </div>

    <!-- Controls -->
    <a class="left carousel-control" href="#@Model.CarouselId" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Назад</span>
    </a>
    <a class="right carousel-control" href="#@Model.CarouselId" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Вперёд</span>
    </a>
</div>